<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="author" content="微普科技 http://www.wiipu.com"/>
    <title>js动态创建元素并设置样式</title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        #zmkt {
            width: 600px;
            height: 250px;
            margin: 50px auto;
            background-color: #EAE7FF;
            text-align: center;
        }
    </style>
    <script>
        window.onload = function () {
            let input = document.createElement('input')
            input.style.width = '400px'
            input.style.height = '50px'
            input.style.marginTop = '100px'
            // input.value = '请输入你的手机号'
            input.placeholder = ';请输入你的手机号'
            // 这里应该使用placeholder 更好吧？？
            input.type = 'text'
            let form = document.querySelector('#zmkt')
            form.appendChild(input)
        }
    </script>
</head>
<body>
<!--提示：使用js动态创建元素input输入框，添加到form元素中，
    并为输入框设置样式，宽：400px;高：50px;margin-top: 100px;
    type类型为text;value值为：请输入你的手机号
-->
<form action="" id="zmkt">

</form>
</body>
</html>
